<template>
    <el-affix ref="pageButtomRef" position="bottom" :offset="0" style="height:53px;margin:10px -10px -10px -10px;">
        <div class="page-bottom w100">
            <slot>
            </slot>
        </div>
	</el-affix>
</template>
<script lang="ts">
export default {
    name: 'pageBottom',
}
</script>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
 const pageButtomRef = ref();
//  onMounted(()=>{
//     pageButtomRef.value.update();
//  });
    // const fixed = ref(false);
    // const onChange = (_fixed: boolean)=>{
    //     console.log(_fixed);
    //     fixed.value = _fixed;
    // }
</script>
<style scoped lang="scss">
.page-bottom{
    border-top: 1px solid var(--el-border-color);
    line-height:50px;
    background-color:var(--el-bg-color-page);
    text-align: center;
    height: 53px;
    position: absolute;
    bottom: 0;
}

</style>